<template>
  <div class="mes_search" v-if="searchFilterList.length > 0">
    <ordinary-search
      :codeScan="codeScan"
      @codeSubmit="handleCodeScan"
      :searchList="searchFilterList"
      ref="OrdinarySearch"
      @ordinarySearch="_searchInfo"
      :searchResult="searchResult">
      <div class="other_btn" v-if="searchSeniorShow">
        <span class="senior_btn" v-show="searchSeniorBtnShow" v-if="!isShow" @click="isShow = true">
          高级查询
          <i class="iconfont icon-arrow_down"></i>
        </span>
        <span class="senior_btn" v-show="searchSeniorBtnShow" v-else @click="isShow = false">
          收起
          <i class="iconfont icon-arrow_up"></i>
        </span>
        <slot name="handleBtn"></slot>
      </div>
    </ordinary-search>
    <senior-search
      v-if="searchSeniorShow"
      ref="SeniorSearch"
      @seniorSearch="_searchInfo"
      :isShow="isShow"
      :searchList="searchFilterList">
    </senior-search>
  </div>
</template>

<script>
import SeniorSearch from './SeniorSearch'

export default {
  name: 'MesSearch',
  props: {
    searchList: {
      // 搜索配置列表
      type: Array,
      required: true
    },
    searchSeniorShow: {
      // 是否显示高级搜索
      type: Boolean,
      default: true
    },
    searchSeniorBtnShow: {
      // 是否显示高级搜索按钮
      type: Boolean,
      default: true
    },
    searchResult: {
      // 搜索结果
      type: Number,
      default: NaN
    },
    codeScan: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      // 是否显示高级搜索
      isShow: false,
    }
  },
  computed: {
    searchFilterList() {
      return this.searchList.filter(item => item.noSearch !== true) || []
    }
  },
  components: {
    SeniorSearch
  },
  mounted() {
  },
  methods: {
    // 清空所有搜索条件
    clean() {
      this.$refs.SeniorSearch.clean()
      this.$refs.OrdinarySearch.clean()
      this.isShow = false
    },
    _searchInfo(searchInfo) {
      this.$emit('searchInfo', searchInfo)
    },
    handleCodeScan(value) {
      this.$emit('codeSubmit', value)
    }
  }
}
</script>
